<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core">

<h:body>

	<ui:composition template="/commonLayout.xhtml">
		<ui:define name="content">
			<div class="formArticle well">
				<h:form id="formMessage">
					<fieldset>
						<legend>Envoyer un message</legend>
						<table>
						<tr><td><h5>Les destinataires</h5></td></tr>
							<tr><td><p:messages id="messages" showDetail="true"/> </td></tr>
							<tr>
								<td><p:pickList id="pojoPickList"
										value="#{messagerie.eleveListe}" var="e" 
										itemValue="#{e.idUtilisateur}" itemLabel="#{e.nom} #{e.prenom}"
										converter="utilisateurConverter"
										 showSourceFilter="true" effect="blind"
										 filterMatchMode="contains" 
										 addLabel="Ajouter" addAllLabel="Ajouter tout le monde"
										 removeLabel="Supprimer" removeAllLabel="Supprimer tout le monde">

										<f:facet name="sourceCaption">Les utilisateurs</f:facet>
										<f:facet name="targetCaption">Destinataires</f:facet>

										<p:ajax event="transfer" listener="#{messagerie.onTransfer}" />


										<p:column style="width:100%;">  
								            #{e.nom}  #{e.prenom}
								        </p:column>
									</p:pickList></td>
							</tr>
							<tr><td><h5>Le message</h5></td></tr>
							<tr>
								<td><h:inputText id="titre" style="width:97%" name="titre"
										value="#{messagerie.article.titre}" /> <p:watermark
										value="Titre.." for="titre"></p:watermark></td>
							</tr>
							<!-- <tr>
								<td><h:inputText id="sousTitre" style="width:95%"
										name="sousTitre" value="#{messagerie.article.sousTitre}" /> <p:watermark
										value="Sous-titre.." for="sousTitre"></p:watermark></td>
							</tr> -->
							<tr>
								<td><h:inputTextarea value="#{messagerie.article.texte}"
										id="texte" /></td>
							</tr>
							<tr>
								<td><p:commandButton styleClass="btn btn-info" id="submit"
										value="Envoyer un message" update="formMessage"
										actionListener="#{messagerie.envoyerMessage}"
										onclick="alert(tinyMCE.get('elm1').getContent());return false;" /></td>
							</tr>

						</table>
					</fieldset>

				</h:form>
			</div>
		</ui:define>
	</ui:composition>

</h:body>
</html>